import { LineEdit, HorizontalBox, Button, VerticalBox, Palette, Switch, TabWidget, TextEdit, ComboBox, ScrollView } from "std-widgets.slint";
import { AboutSlintWindow } from "about.slint";
import {SettingWindow} from "settings.slint";
import { ErrorWindow } from "hint.slint";
import "./NotoSansCJK-Regular.ttc";

/*
The structure is as followed:

+--------------------------------------------+
|               MainWindow                   |
| +----------------------------------------+ |
| |            base-area                   | |
| | +------------------------------------+ | |
| | |    header-area (HorizontalBox)     | | |
| | +------------------------------------+ | |
| | |       main-area (HorizontalBox)    | | |
| | | +--------------------------------+ | | |
| | | |      TabWidget Titles          | | | |
| | | | +----------------------------+ | | | |
| | | | |         Tabs               | | | | |
| | | | +----------------------------+ | | | |
| | | +--------------------------------+ | | |
| | +------------------------------------+ | |
| +----------------------------------------+ |
*/

export global Logic {
    // Implementation of this callback is seen in the business logic (Rust script).
    pure callback translate-word(string, string, string, string);
    pure callback translate-sentence(string, string, string, string);
    pure callback load-settings();
    pure callback save-settings();
}

export struct Settings {
    deepseek_api_key: string,
    qwen_api_key: string,
}

export component AboutSlintWindow inherits AboutSlintWindow {
    title: "About Slint";
}

export component SettingWindow inherits SettingWindow {

    title: "Settings";

    in-out property <Settings> settings-from-slint: { deepseek-api-key: self.deepseek-api-key, qwen-api-key: self.qwen-api-key };

    public function sync-settings-from-property() {
        self.deepseek-api-key = settings-from-slint.deepseek-api-key;
        self.qwen-api-key = settings-from-slint.qwen-api-key;
    }
    public function sync-settings-property-from-attributes() {
        settings-from-slint.deepseek-api-key = self.deepseek-api-key;
        settings-from-slint.qwen-api-key = self.qwen-api-key;
    }

    save-button := Button {
        text: "Save";
        clicked => {
            sync-settings-property-from-attributes();
            Logic.save-settings();
        }
    }
}

export component ErrorWindow inherits ErrorWindow {

    title: "Error";

    in-out property <string> error-text <=> self.text;
    in-out property <string> error-hint <=> self.hint;
}

export enum WordTransType {
    word,
    phonetic,
    part-of-speech,
    definition,
    explanation,
    idiom-and-phrase,
    example,
    example-translation,
    header,
    error
}

export struct WordTransResult {
    type_: WordTransType,
    text: string,
    index: string,
}

export component MainWindow inherits Window {

    title: "Neat Translator";

    default-font-family: "Noto Sans CJK SC";

    in-out property <string> original-text <=> sentence-original-textedit.text;
    in-out property <[WordTransResult]> word-trans-results;
    in-out property <string> sentence-translate-result <=> sentence-translated-textedit.text;

    private property <[string]> languages: [
        "Chinese",
        "English",
        "French",
        "German",
        "Russian",
        "Japanese",
        "Korean",
        "Spanish"
    ];

    private property <[string]> engines: ["DeepSeek", "Youdao", "Qwen"];

    pure callback show-about-slint();
    pure callback show-setting-window();

    min-height: 500px;
    preferred-height: self.min-height;

    min-width: 800px;
    preferred-width: self.min-width;

    base-area := VerticalBox {

        header-area := HorizontalBox {
            alignment: LayoutAlignment.space-between;

            HorizontalLayout {
                Text {
                    text: "Neat Translator";
                    font-size: 20px;

                    horizontal-alignment: TextHorizontalAlignment.center;
                    wrap: TextWrap.word-wrap;
                }
            }

            HorizontalLayout {
                Button { // Theme mode selector with dark, light, auto modes
                    property <string> theme: "Auto";
                    text: "Theme: " + self.theme;
                    clicked => {
                        if self.theme == "Auto" {
                            self.theme = "Dark";
                            Palette.color-scheme = ColorScheme.dark;
                        } else if self.theme == "Dark" {
                            self.theme = "Light";
                            Palette.color-scheme = ColorScheme.light;
                        } else if self.theme == "Light" {
                            self.theme = "Auto";
                            Palette.color-scheme = ColorScheme.unknown;
                        }
                        self.text = "Theme: " + self.theme;
                    }
                }

                Button {    // About Slint
                    text: @tr("About Slint");
                    clicked => {
                        root.show-about-slint()
                    }
                }
            }

            // Settings
            Button {
                text: @tr("Settings");
                clicked => {
                    root.show-setting-window();
                }
            }
        }

        main-area := HorizontalBox {

            alignment: LayoutAlignment.stretch;

            TabWidget {

                Tab {   // Word translation
                    title: "Word";
                    VerticalBox {

                        HorizontalLayout {
                            vertical-stretch: 0;
                            alignment: LayoutAlignment.space-between;

                            HorizontalLayout {
                                height: sentence-translate-to-combobox.min-height;
                                alignment: LayoutAlignment.center;
                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "From";
                                    font-size: 16px;
                                }

                                word-translate-from-combobox := ComboBox {
                                    model: languages;
                                    current-index: 1;
                                }

                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "To";
                                    font-size: 16px;
                                }

                                word-translate-to-combobox := ComboBox {
                                    model: languages;
                                    current-index: 0;
                                }
                            }

                            HorizontalLayout {
                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "Engine";
                                    font-size: 16px;
                                }

                                word-engine-combobox := ComboBox {
                                    model: engines;
                                    current-index: 0;
                                }
                            }
                        }

                        HorizontalBox {
                            max-height: search-line-edit.min-height;
                            search-line-edit := LineEdit {
                                height: 50px;
                                font-size: 24px;
                                accepted => {
                                    Logic.translate-word(
                                        search-line-edit.text,
                                        word-translate-from-combobox.current-value,
                                        word-translate-to-combobox.current-value,
                                        word-engine-combobox.current-value);
                                    search-line-edit.select-all();
                                    // Implement translation logic here
                                }
                            }

                            Button {
                                text: "Translate";
                                clicked => {
                                    Logic.translate-word(
                                        search-line-edit.text,
                                        word-translate-from-combobox.current-value,
                                        word-translate-to-combobox.current-value,
                                        word-engine-combobox.current-value);
                                }
                            }
                        }

                        ScrollView {
                            horizontal-scrollbar-policy: ScrollBarPolicy.always-off;
                            width: 100%;

                            VerticalLayout {
                                alignment: LayoutAlignment.start;
                                width: 100%;

                                for data in root.word-trans-results: HorizontalBox {
                                    states [
                                        word when data.type_ == WordTransType.word: {
                                            t.font-size: 24px;
                                            t.color: #ff584d;
                                            t.font-weight: 700;
                                            white-space.width: 5px;
                                            index-text.width: 0px;
                                        }
                                        phonetic when data.type_ == WordTransType.phonetic: {
                                            t.font-size: 16px;
                                            t.font-family: "Arial";
                                            white-space.width: 10px;
                                            index-text.width: 0px;
                                        }
                                        part-of-speech when data.type_ == WordTransType.part-of-speech: {
                                            t.font-size: 14px;
                                            t.color: #ff584d;
                                            white-space.width: 10px;
                                            index-text.width: 0px;
                                        }
                                        definition when data.type_ == WordTransType.definition: {
                                            t.font-size: 16px;
                                            white-space.width: 15px;
                                        }
                                        explanation when data.type_ == WordTransType.explanation: {
                                            t.font-size: 16px;
                                            white-space.width: 15px;
                                        }
                                        idiom-and-phrase when data.type_ == WordTransType.idiom-and-phrase: {
                                            t.font-size: 16px;
                                            white-space.width: 15px;
                                        }
                                        example when data.type_ == WordTransType.example: {
                                            t.font-size: 14px;
                                            white-space.width: 15px;
                                        }
                                        example-translation when data.type_ == WordTransType.example-translation: {
                                            t.font-size: 14px;
                                            white-space.width: 15px;
                                        }
                                        header when data.type_ == WordTransType.header: {
                                            t.font-size: 14px;
                                            white-space.width: 0px;
                                            t.color: #60cdff;
                                        }
                                        error when data.type_ == WordTransType.error: {
                                            t.font-size: 14px;
                                            white-space.width: 0px;
                                            index-text.width: 0px;
                                            t.color: #ff0000;
                                        }
                                    ]
                                    white-space := Rectangle {
                                        horizontal-stretch: 0.;
                                    }

                                    index-text := Text {
                                        text: data.index;
                                        width: 10px;
                                        vertical-alignment: TextVerticalAlignment.center;
                                    }

                                    t := Text {
                                        text: data.text;
                                        horizontal-stretch: 1.;
                                        vertical-alignment: TextVerticalAlignment.center;
                                        wrap: TextWrap.word-wrap;
                                    }
                                }
                            }
                        }
                    }
                }

                Tab {   // Sentence translation
                    title: "Sentences";

                    private property <int> seconds: 1;
                    private property <string> old-string;
                    private property <string> new-string;

                    // timer := Timer {
                    //     interval: 3s;
                    //     running: false;
                    //     triggered() => {
                    //         new-string = original-textedit.text;
                    //         if (old-string == new-string) {
                    //             // translated-text.text = Logic.translate-sentence(new-string);
                    //             debug("Timer: old string is " + old-string + "New string is" + new-string);
                    //             Logic.translate-sentence(new-string);
                    //             self.running = false;
                    //         }
                    //     }
                    // }

                    VerticalBox {

                        HorizontalLayout {
                            vertical-stretch: 0;
                            alignment: LayoutAlignment.space-between;

                            HorizontalLayout {
                                height: sentence-translate-to-combobox.min-height;
                                alignment: LayoutAlignment.center;
                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "From";
                                    font-size: 16px;
                                }

                                sentence-translate-from-combobox := ComboBox {
                                    model: languages;
                                    current-index: 1;
                                }

                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "To";
                                    font-size: 16px;
                                }

                                sentence-translate-to-combobox := ComboBox {
                                    model: languages;
                                    current-index: 0;
                                }
                            }

                            HorizontalLayout {
                                Text {
                                    vertical-alignment: TextVerticalAlignment.center;
                                    text: "Engine";
                                    font-size: 16px;
                                }

                                sentence-engine-combobox := ComboBox {
                                    model: engines;
                                    current-index: 0;
                                }
                            }
                        }

                        HorizontalBox {
                            vertical-stretch: 100;
                            alignment: LayoutAlignment.space-around;

                            Rectangle {
                                width: 49%;
                                Text {
                                    text: "Press [Ctrl + Enter] to translate";
                                    x: sentence-original-textedit.x + sentence-original-textedit.width - self.width;
                                    y: sentence-original-textedit.y + sentence-original-textedit.height - self.height;
                                    z: 1;
                                }

                                sentence-original-textedit := TextEdit {
                                    width: 100%;
                                    height: 100%;
                                    font-size: 16px;
                                    wrap: TextWrap.word-wrap;

                                    key-pressed(event) => {
                                        if (event.modifiers.control && (event.text == "\n")) {
                                            debug("Pressed Ctrl + Enter");
                                            Logic.translate-sentence(
                                                sentence-original-textedit.text,
                                                sentence-translate-from-combobox.current-value,
                                                sentence-translate-to-combobox.current-value,
                                                sentence-engine-combobox.current-value);

                                            return EventResult.accept;
                                        } else {
                                            return EventResult.reject;
                                        }
                                    }
                                }
                            }

                            sentence-translated-textedit := TextEdit {
                                width: 49%;
                                font-size: 16px;
                                wrap: TextWrap.word-wrap;
                                read-only: true;
                            }
                        }
                    }
                }

                Tab {
                    title: "history";
                }
            }
        }
    }
}
